<template>
  <el-select v-model="selected" placeholder="请选择" @change="changeLang">
    <el-option
            v-for="option in options"
            :key="option.value"
            :label="option.text"
            :value="option.value">
    </el-option>
  </el-select>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'

@Component({ name: 'i18n' })
export default class Login extends Vue {
  private selected: string = window.localStorage.lang || 'zh_CN'
  private options: object[] = [{ text: '中文(简体)', value: 'zh_CN' }, { text: 'English', value: 'en' }]
  private changeLang () {
    window.localStorage.setItem('lang', this.selected)
    this.$emit('changeLang', this.selected)
  }

  private beforeMount () {
    const lang = window.localStorage.getItem('lang')
    if (!lang) {
      window.localStorage.setItem('lang', 'zh_CN')
    }
  }
}
</script>
